package com.example.composableexample.custom.animation

import androidx.compose.animation.core.FastOutSlowInEasing
import androidx.compose.animation.core.LinearEasing
import androidx.compose.animation.core.RepeatMode
import androidx.compose.animation.core.animateFloat
import androidx.compose.animation.core.infiniteRepeatable
import androidx.compose.animation.core.rememberInfiniteTransition
import androidx.compose.animation.core.tween
import androidx.compose.foundation.Canvas
import androidx.compose.foundation.Image
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.icons.Icons
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.draw.rotate
import androidx.compose.ui.draw.scale
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.ColorFilter
import androidx.compose.ui.graphics.StrokeCap
import androidx.compose.ui.graphics.drawscope.Stroke
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.res.vectorResource
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import coil.compose.AsyncImage
import com.example.composableexample.R

/**
 * author: LiLiang
 * createTime: 2022/10/8-8:59
 * remark:
 **/

@Composable
fun AnimateFloat() {
    val heartbeatAnimation by rememberInfiniteTransition().animateFloat(
        initialValue = 1f,
        targetValue = 1.4f,
        animationSpec = infiniteRepeatable(animation = tween(1000), repeatMode = RepeatMode.Reverse)
    )

    val angleOffset = 30f
    val wiggleAnimation by rememberInfiniteTransition().animateFloat(
        initialValue = -angleOffset,
        targetValue = angleOffset,
        animationSpec = infiniteRepeatable(
            animation = tween(500, easing = LinearEasing),
            repeatMode = RepeatMode.Reverse
        )
    )

    val flashAnimation by rememberInfiniteTransition().animateFloat(
        initialValue = 1f,
        targetValue = 0f,
        animationSpec = infiniteRepeatable(
            animation = tween(1000, easing = FastOutSlowInEasing),
            repeatMode = RepeatMode.Reverse
        )
    )

    val arcAngle1 by rememberInfiniteTransition().animateFloat(
        initialValue = 0f,
        targetValue = 180f,
        animationSpec = infiniteRepeatable(
            animation = tween(1000, easing = LinearEasing),
            repeatMode = RepeatMode.Reverse
        )
    )
    val arcAngle2 by rememberInfiniteTransition().animateFloat(
        initialValue = 180f,
        targetValue = 360f,
        animationSpec = infiniteRepeatable(
            animation = tween(1000, easing = LinearEasing),
            repeatMode = RepeatMode.Reverse
        )
    )

    val scaleCircles by rememberInfiniteTransition().animateFloat(
        initialValue = 0.3f,
        targetValue = 1f,
        animationSpec = infiniteRepeatable(
            animation = tween(1000, easing = LinearEasing),
            repeatMode = RepeatMode.Reverse
        )
    )


    Column(modifier = Modifier.fillMaxSize(), horizontalAlignment = Alignment.CenterHorizontally) {

        Image(
            imageVector = ImageVector.vectorResource(id = R.drawable.heart),
            contentDescription = "",
            modifier = Modifier
                .scale(heartbeatAnimation)
                .size(80.dp)
                .padding(top = 28.dp),
            colorFilter = ColorFilter.tint(Color.Red)
        )

        Box(
            modifier = Modifier
                .padding(top = 60.dp)
                .size(80.dp)
                .rotate(wiggleAnimation)
                .clip(
                    RoundedCornerShape(12.dp)
                )
                .background(Color.Magenta)
        )

        Box(
            modifier = Modifier
                .padding(top = 60.dp)
                .size(80.dp)
                .clip(RoundedCornerShape(12.dp))
                .background(Color.Cyan.copy(flashAnimation))
        )

        Box(
            modifier = Modifier
                .padding(top = 28.dp)
                .scale(scaleCircles)
        ) {
            Box(
                modifier = Modifier
                    .align(Alignment.Center)
                    .size(50.dp)
                    .background(Color.Red, shape = CircleShape)
            ) {
                Canvas(
                    modifier = Modifier
                        .rotate(arcAngle1)
                        .align(Alignment.Center)
                        .size(30.dp),
                    onDraw = {
                        drawArc(
                            color = Color.Black,
                            style = Stroke(width = 10f, cap = StrokeCap.Round),
                            startAngle = 180f,
                            sweepAngle = 288f,
                            useCenter = false
                        )
                    }
                )
            }
            Box(modifier = Modifier.rotate(arcAngle2)) {
                Canvas(
                    modifier = Modifier
                        .rotate(180f)
                        .align(Alignment.Center)
                        .size(100.dp),
                    onDraw = {
                        drawArc(
                            color = Color.Blue,
                            style = Stroke(width = 10f, cap = StrokeCap.Round),
                            startAngle = 180f,
                            sweepAngle = 288f,
                            useCenter = false
                        )
                    }
                )
            }
            Canvas(
                modifier = Modifier
                    .rotate(arcAngle2)
                    .align(Alignment.Center)
                    .size(60.dp),
                onDraw = {
                    drawArc(
                        color = Color.Blue,
                        style = Stroke(width = 10f, cap = StrokeCap.Round),
                        startAngle = 180f,
                        sweepAngle = 288f,
                        useCenter = false
                    )
                }
            )
        }
    }
}